<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>跑步</title>
</head>

<body>
    <main>
        <div class="bgt">
            <div class="distance container">
                <p>目前累计跑步距离</p>
                <div>
                    <span id="zongLuCheng">99</span>公里
                </div>
            </div>
            <div class="bgt-map" id="bgtMap">

            </div>
        </div>

        <!-- 模态框 -->
        <div class="go">
            <div id="go01">GO</div>
        </div>
        <!-- 模态框 -->
        <div class="motai hello">
            <div class="daojishi">3</div>
        </div>

        <!-- 模态框 运动界面-->
        <div class="main123 motai">
            <div class="container">
                <div>
                    <p>户外跑</p>
                    <div class="sportong">
                        <span>运动中</span>
                        <div>
                            <i></i>
                            <i></i>
                        </div>
                    </div>
                </div>

                <div class="soprt-title">
                    <span class="lucheng">99.99</span>公里
                </div>

                <div class="manp">
                    <i></i>
                    <span class="iconfont iconditu " id="locRunMap"></span>
                </div>
                <!-- 配速 -->
                <div class="speed">
                    <div class="speed-list">
                        <i class="iconfont iconsudu"></i>
                        配速
                    </div>
                    <div class="speed-list">
                        <i class="iconfont iconshijiyongshi"></i>
                        用时
                    </div>
                    <div class="speed-list">
                        <i class="iconfont iconqialuli"></i>
                        千卡
                    </div>
                </div>

                <div class="time">
                    <span class="lucheng">--</span>
                    <span id="startRunTime10">00:00:00</span>
                    <span class="kaluli">3000</span>
                </div>

                <div class="continiu1" id="clickBtn">
                    <div class="continiu2">
                        <i class="iconfont iconzanting"></i>
                        暂停
                    </div>
                    <span class="iconfont iconpeisu" id="suoding"></span>
                </div>

                <div class="yincang">
                    <div class="continiu3">
                        <div class="continiu4 " id="linglei">
                            <i class="iconfont iconicon_play"></i>
                            <span id="continue">继续</span>
                        </div>
                        <div class="continiu4" id="runEnd">
                            <i class=" iconfont iconjieshu"></i>
                            <span id="end">结束</span>
                        </div>
                    </div>
                </div>

            </div>

        </div>
        <!-- 模态框  地图 -->
        <div class="run-map" id="runMap">

        </div>


            <div class="click-fanhui"><i class="iconfont iconleftarrow"></i></div>

            <div class="click-wancheng" id="clickWancheng">完成</div>

            <div class="run-shuju" id="runShuju">
                <div class="outdoor-running"><span>户外跑</span> <span id="specificDate">年月日</span></div>
                <div class="run-distance">
                    <div>
                        <p>配速</p>
                        <p class="peisu">--</p>
                    </div>
                    <div>
                        <p>用时</p>
                        <p id="startRunTime1">--</p>
                    </div>
                    <div>
                        <p>距离</p>
                        <p class="lucheng">--</p>
                    </div>
                </div>
            </div>

    </main>

    <!-- 百度地图 -->

    
    
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=3YGSRE3TkrCfoHclx6cNqz4GVDGjAKQm"></script>
</body>

</html>